<div class="charge_item banklist bank-item">
    <select class="am-form-field" data-am-selected="{maxHeight: 250}">
    </select>
</div>

<div class="charge_item name addr bank-item">
    <input type="text" class="am-form-field" placeholder="请填写开户网点" />
</div>

<div class="charge_item time account bank-item">
    <input type="number" class="am-form-field" placeholder="请填写银行卡卡号" style="font-weight: normal;" />
</div>

<div class="name2">开户姓名：<span>--</span></div>

<button class="button button-block button-positive button-disable" type="submit">确定</button>

<style type="text/css">
    .bank-item {
        height: 49px;
        margin: 1px 10px 0px 10px;
        background-color: rgba(255,255,255,0.4);
        border: 1px solid rgb(245,245,245);
        font-size: 14px;
    }
    .bank-item .am-selected {
        width: 100%;
    }
    .bank-item .am-selected-btn {
        background: none !important;
        border: 0px !important;
        font-size: 14px;
        font-weight: normal;
        color: #333;
        line-height: 49px;
        padding-top: 0px;
        padding-bottom: 0px;
    }
    .bank-item input {
        background: none;
        border: 0px;
        line-height: 49px;
        padding: 0px 10px 0px 10px;
        font-size: 14px;
    }
    div.name2 {
        color: #333;
        margin: 10px 0px 15px 18px;
        font-size: 14px;
    }
    .button-block {
        margin-top: 10px;
    }
    .am-selected-list {
        font-size: 14px;
        line-height: 1rem;
    }
</style>

<script>
    $("#center-top .home").hide();
    $("#center-top .back").show();
    $("#center-top .menu").hide();
    
    // 填充银行信息
    var s = $(".charge_item select");
    s.empty();
    for (var i in Util.banks) {
        s.append('<option value="__v__">__v__</option>'.replace(/__v__/g, Util.banks[i].name));
    }

    function drawCardInfo() {
        if (!context.user) return;

        // 开户姓名
        $("div.name2 span").html(context.user.user.name);

        var v = context.user.user.bank;
        if (!v || v == '') {
            return;
        }

        v = JSON.parse(v);

        $(".card .line1 .name").html(v.bank);
        $(".addr input").val(v.addr);
        $(".account input").val(v.account);

        $(".charge_item select").val(v.bank);
        $(".charge_item select").trigger('changed.selected.amui');
    }
    drawCardInfo();
    ME.cb = function() {
        ME.cb = null;
        drawCardInfo();
    };

    var _checkEnable = function() {
        var addr = $(".addr input").val().trim();
        var account = $(".account input").val().trim();
        if (addr == '') {
            return false;
        }
        if (account == '') {
            return false;
        }
        return true;
    }
    $("input").bind('input propertychange', function() {
        if (_checkEnable()) $(".button-block").removeClass("button-disable");
        else $(".button-block").addClass("button-disable");
    });

    $(".button-block").click(function() {
        var addr = $(".addr input").val().trim();
        var account = $(".account input").val().trim();
        if (addr == '') {
            alert2("请填写开户网点名称！");
            return;
        }
        if (account == '') {
            alert2("请填写您的银行卡卡号！");
            return;
        }

        startSpin();
        CMD.modify_user_info(undefined, {
            bank: JSON.stringify({
                bank: $(".charge_item select").val(),
                addr: addr,
                account: account,
            }),
        }, function() {
            stopSpin();
            Util.jumpUrl({
                cmd: "charge",
                n: "take",
            });
        });
    });
</script>
